<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
  <meta http-equiv="keywords" content="关键字,关键字,关键字"/>
  <meta http-equiv="pragma" content="no-cache"/>
  <meta http-equiv="cache-control" content="no-cache"/>
  <meta http-equiv="expires" content="0"/>
  <meta name="description" content="页面描述不超过150个字符"/>
  <meta name="Author" content="页面作者"/>
  <meta name="renderer" content="webkit"/>
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
  <link rel="shortcut icon" href="../public/images/favicon.ico" type="image/x-icon" >
  <link rel="stylesheet" type="text/css" href="../public/layui/dist/css/layui.css"/>
  <link rel="stylesheet" href="../public/stylesheets/gx_main.min.css" />
  <link rel="stylesheet" type="text/css" href="../public/iconfont/iconfont.css">
  <!--[if lt IE 9]>
  <script src="../public/html5shiv/dist/html5shiv.min.js"></script>
  <script src="../public/respond/dest/respond.min.js"></script>
  <![endif]-->
  <script src="../public/jquery/dist/jquery.min.js" type="text/javascript" charset="utf-8"></script>
  <script src="../public/layui/dist/layui.js" type="text/javascript" charset="utf-8"></script>
  <script type="text/javascript" src="../public/highcharts-5.0.14/code/highcharts.js"></script>
  <!--mine-->
  <script src="../public/javascripts/gx_main.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body class="frame">

<div class="layui-form">
  <div class="layui-form-item">
    <div class="layui-inline">
      <label class="layui-form-label">采样设备</label>
      <div class="layui-input-inline">
        <input class="layui-input layui-disabled" type="text" autocomplete="off" placeholder="请输入采样设备" value="">
      </div>
    </div>
    <div class="layui-inline">
      <label class="layui-form-label">采样接口</label>
      <div class="layui-input-inline">
        <input class="layui-input layui-disabled" type="text" autocomplete="off" placeholder="请输入采样接口" value="">
      </div>
    </div>
    <div class="layui-inline">
      <label class="layui-form-label">采样频率</label>
      <div class="layui-input-inline">
        <input class="layui-input layui-disabled" type="text" autocomplete="off" placeholder="请输入频率" value="">
      </div>
    </div>
    <div class="layui-inline">
      <div class="layui-input-inline">
        <button class="layui-btn layui-btn-darkBlue" id="sub_index_search">查询</button>
      </div>
    </div>
  </div>
</div>
<div class="layui-form">
  <table class="layui-table">
    <thead class="lightBlue center">
    <tr>
      <th colspan="3">采集数据信息</th>
    </tr>
    </thead>
    <tbody class="grey center">
    <tr>
      <td>发送机寿命(年)</td>
      <td>20</td>
      <td>
        <a href="javascript:;" class="frame_history"><span class="iconfont icon-gx_jiLu"></span>历史</a>
        <a href="javascript:;"><span class="iconfont icon-gx_quShi"></span>趋势</a>
      </td>
    </tr>
    <tr>
      <td>发送机寿命(年)</td>
      <td>20</td>
      <td>
        <a href="javascript:;" class="frame_history"><span class="iconfont icon-gx_jiLu"></span>历史</a>
        <a href="javascript:;"><span class="iconfont icon-gx_quShi"></span>趋势</a>
      </td>
    </tr>
    <tr>
      <td>发送机寿命(年)</td>
      <td>20</td>
      <td>
        <a href="javascript:;" class="frame_history"><span class="iconfont icon-gx_jiLu"></span>历史</a>
        <a href="javascript:;"><span class="iconfont icon-gx_quShi"></span>趋势</a>
      </td>
    </tr>
    <tr>
      <td>发送机寿命(年)</td>
      <td>20</td>
      <td>
        <a href="javascript:;" class="frame_history"><span class="iconfont icon-gx_jiLu"></span>历史</a>
        <a href="javascript:;"><span class="iconfont icon-gx_quShi"></span>趋势</a>
      </td>
    </tr>
    <tr>
      <td>发送机寿命(年)</td>
      <td>20</td>
      <td>
        <a href="javascript:;" class="frame_history"><span class="iconfont icon-gx_jiLu"></span>历史</a>
        <a href="javascript:;"><span class="iconfont icon-gx_quShi"></span>趋势</a>
      </td>
    </tr>
    </tbody>
  </table>
</div>
<script>
  layui.use('layer',function(){
    var $ = layui.jquery, layer = layui.layer; //独立版的layer无需执行这一句
    //历史弹窗
    $('.frame_history').on('click',function(){
      layer.open({
        type: 2               //此处以iframe举例
        ,skin: 'gx_layer'     //弹出框皮肤
        ,title: '<span class="iconfont icon-gx_jiLu"></span>历史'
        ,area: ['450px', '300px']
        ,shade: .5            //遮罩层透明度
        ,closeBtn: 1          //关闭样式
        ,maxmin: true         //头部关闭按钮
        ,shadeClose:true      //点击遮罩层取消模态框
        ,content: 'frame_history.html'
      });
    })
    //查询
    $("#sub_index_search").on('click',function(){
      layer.open({
        type: 2               //此处以iframe举例
        ,skin: 'gx_layer'
        ,title: '<span class="iconfont icon-gx_fangDaJing"></span>查询'
        ,area: ['530px', '550px']
        ,shade: .5            //遮罩层透明度
        ,maxmin: true         //头部关闭按钮
        ,shadeClose:true      //点击遮罩层取消模态框
        ,content: 'frame_search.html'
      });
    });
  })
</script>

</body>
</html>
